<template>
  <div class="page">
    <headerbar>身边好党员
      <broadcastDetail v-if="typeof detail.newsContent !='undefined' && tools.NotIsNull(detail.newsContent.ttsOssUrl)" :detail="detail"/>
    </headerbar>
    <fetchData  class="bg-white" :loading="isLoading" :data="data"></fetchData>
    <abnormal class="bg-white" @refresh="loadData" v-if="abnormal"></abnormal>
    <section class=" bg-white">
      <section class="detail" v-if="data.newsContentExt">
        <h1 class="title">{{preData.title}}</h1>
        <p class="date no-wrap">来源：{{preData.source || '未知'}} <span class="float-right">时间：{{tools.formatDate(preData.createTime)}}</span></p>
        <p class="color-red pdh-2 pdv-1 shortTitle">{{preData.shortTitle}}</p>
        <p class="line"></p>
        <div class="cont-text" v-html="data.newsContentExt.contents">
        </div>
        <!--<div class="cont-text">
          <div @click="collection()" class="btn">收藏</div>
        </div>-->

        <fileDownloadComponent :files="data.files"></fileDownloadComponent>

        <p class="pdv-2" ></p>
        <viewsUpsComponent v-if="detail.newsContent"></viewsUpsComponent>
      </section>
    </section>

    <p class="pdv-3" v-if="!isLoading&&!abnormal"></p>

    <section class="d-scroll-2head bg-white " :class="[{'d-scroll-3head': isInputFocus}]">
      <!--<div class="water-logo" v-if="preData.comments < 1">
        <img src="../../../../static/images/dangjian/home/logo.png" alt="">
      </div>-->

      <commentListComponent v-if="detail.newsContent" :_contentId="detail.newsContent.id" :shareType="0" @onInputFocus="onInputFocus"></commentListComponent>
    </section>

  </div>
</template>

<script>
  import fileDownloadComponent from '@/components/common/fileDownloadComponent.vue'
  import tools from '@/utils/tools'
  import loginService from '@/service/loginService'
  import commentListComponent from '@/components/common/commentListComponent'
  import viewsUpsComponent from '@/components/common/viewsUpsComponent'
  export default {
    components: {viewsUpsComponent, commentListComponent, fileDownloadComponent},
    name: 'goodPartyMembersAroundDetail',
    data () {
      return {
        isLoading: true,
        preData: {},
        data: {},
        detail: {},
        id: '',
        abnormal:false,
        isInputFocus: false,
      }
    },
    created () {
      this.preData = this.$store.state.newsDetail
      this.id = this.$route.params.id
      this.$store.state.flagType = 1
      this.loadData()
    },
    methods: {
      onInputFocus(blo) {
        this.isInputFocus = blo;
      },
      loadData () {
        this.isLoading = true
        loginService.contentDetailNew(this.id).then((res) => {
        // loginService.contentDetail(this.id).then((res) => {
          this.isLoading = false
          this.like(this.id);
          if (res.code !== 0) {
            if (res.code == 444) {
              this.abnormal = true
              return
            } else {
              return tools.tip(res.message)
            }
          }
          this.data = res.data
          this.detail = res.data
          this.$store.state.newsDetail.detail = res.data
          this.$store.state.newsDetail.views ++;
          console.log('this.data=', this.data)
          console.log('this.data.newsContentExt=', this.data.newsContentExt)
          this.historyAdd()
        })
      },
      collection () {
        let data = {
          contentId: this.data.newsContentExt.contentId
        }
        loginService.addCollection(data).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          tools.tip('收藏成功！')
        })
      },
    // 添加到我的足迹
      historyAdd () {
        let data = {
          contentId: this.data.newsContentExt.contentId
        }
        loginService.historyAdd(data).then((res) => {
        })
      },
      like (id) {
        let params = {
          contentId: id,
          type: 1
        }
        this.fetchService.updateCount(params).then(res => {
        })
      },
    }
  }
</script>

<style scoped>

</style>
